import React, { Component } from 'react'
import MyTable from './components/MyTable'

export default class App extends Component {
  columns=[
    {
      key:'id',
      columnName:'编号'
    },
    {
      key:'title',
      columnName:'标题'
    },
    {
      key:'content',
      columnName:'内容'
    },
    {
      key:'oper',
      columnName:'操作'
    }
  ]
  state={
    dataSource:[
      {
        id:'1001',
        title:'新闻1',
        content:'北京最近有大暴雨'
      },
      {
        id:'1002',
        title:'新闻2',
        content:'西安回流生'
      }
    ]
  }
  delById=(arg)=>{
    const newary=this.state.dataSource.filter(item=>item.id!==arg)
    this.setState({
      dataSource:newary
    })
  }
  editorById=(arg)=>{
    alert(arg)
  }
  render() {
    return (
      <div>
        <MyTable 
          columns={this.columns} 
          dataSource={this.state.dataSource}
          callback={arg=>(<>
            <button onClick={()=>this.delById(arg.id)}>删除</button>
            <button onClick={()=>this.editorById(arg.id)}>编辑</button>
          </>)}></MyTable>

          <MyTable 
          columns={this.columns} 
            dataSource={this.state.dataSource}
            callback={arg=>(<>
              <a href="#" onClick={()=>this.delById(arg.id)}>删除</a>
              <a href="#" onClick={()=>this.editorById(arg.id)}>编辑</a>
          </>)}></MyTable>
      </div>
    )
  }
}
